@extends('admin.layout.layout', ['row' => @$page])

@section('title', @$page['title'])

@section('contain')
    <link rel="stylesheet" href="/dist/admin/stat.css">
    <div class="container" style="background-color: #f7f9fa;padding-bottom: 20px; padding-top: 20px;max-width: 1300px;">
        <div class="widget-container-box" style="width: 100%; padding: 10px;">国代</div>
        <div class="widget-container-box" style="width: 50%;float: left; padding: 10px;">
            <div class="widget-content-container widget-content-container-title" style="">
                <h6 class="card-title">今年|累计漆膜/窗膜销售卷数</h6>
                <h6 class="card-subtitle mb-2 text-muted">{{ date('Y') . '/1/1'  }}~{{ date('Y/m/d') }}</h6>
                <p>
                    <a href="/admin/stat_compare/all_sales?type=1"><span style="font-size: 2rem;" id="roll_qm_1"></span>&nbsp;&nbsp;卷</a>
                    /
                    <a href="/admin/stat_compare/all_sales?type=2"><span style="font-size: 2rem;" id="roll_win_1"></span> 卷</a>
                </p>
                <p class="show-percent">
                    <div style="width: 50%;float: left;">漆膜同比 <span style="color:#95F204" id="roll_qm_rate_1"></span></div>
                    <div style="width: 50%;float: left;">窗膜同比 <span style="color:#95F204" id="roll_win_rate_1"></span></div>
                </p>
                <p class="show-percent">
                    <div style="width: 50%;float: left;">漆膜环比 <span style="color:#95F204" id="roll_qm_rate_2"></span></div>
                    <div style="width: 50%;float: left;">窗膜环比 <span style="color:#95F204" id="roll_win_rate_2"></span></div>
                </p>
            </div>
        </div>
        <div class="widget-container-box" style="width: 50%;float: left; padding: 10px;">
            <div class="widget-content-container widget-content-container-title" style="">
                <h6 class="card-title">今年|累计漆膜/窗膜销售分数</h6>
                <h6 class="card-subtitle mb-2 text-muted">{{ date('Y') . '/1/1'  }}~{{ date('Y/m/d') }}</h6>
                <p>
                    <a href="/admin/stat_compare/all_scores?type=1" style="cursor: pointer"><span style="font-size: 2rem;" id="roll_qm_2"></span>&nbsp;&nbsp;分</a>
                        /
                    <a href="/admin/stat_compare/all_scores?type=2" style="cursor: pointer"><span style="font-size: 2rem;" id="roll_win_2"></span> 分</a>
                </p>
                <p class="show-percent">
                <div style="width: 50%;float: left;">漆膜同比 <span style="color:#95F204" id="roll_qm_rate_3"></span></div>
                <div style="width: 50%;float: left;">窗膜同比 <span style="color:#95F204" id="roll_win_rate_3"></span></div>
                </p>
                <p class="show-percent">
                <div style="width: 50%;float: left;">漆膜环比 <span style="color:#95F204" id="roll_qm_rate_4"></span></div>
                <div style="width: 50%;float: left;">窗膜环比 <span style="color:#95F204" id="roll_win_rate_4"></span></div>
                </p>
            </div>
        </div>
        <div class="widget-container-box" style="width: 100%; padding: 10px;">省代</div>
        <div class="widget-container-box" style="width: 50%;float: left; padding: 10px;">
            <div class="widget-content-container widget-content-container-title" style="">
                <h6 class="card-title">今年|最佳省代漆膜/窗膜销售卷数</h6>
                <h6 class="card-subtitle mb-2 text-muted">{{ date('Y') . '/1/1'  }}~{{ date('Y/m/d') }}</h6>
                <p>
                    <a href="/admin/stat_compare/dist_sales?type=1" style="cursor: pointer"><span style="font-size: 2rem;" id="roll_qm_3"></span>&nbsp;&nbsp;卷</a>
                    /
                    <a href="/admin/stat_compare/dist_sales?type=2" style="cursor: pointer"><span style="font-size: 2rem;" id="roll_win_3"></span> 卷</a>
                </p>
                <p class="show-percent">
                <div style="width: 50%;float: left;">漆膜同比 <span style="color:#95F204" id="roll_qm_rate_5"></span></div>
                <div style="width: 50%;float: left;">窗膜同比 <span style="color:#95F204" id="roll_win_rate_5"></span></div>
                </p>
                <p class="show-percent">
                <div style="width: 50%;float: left;">漆膜环比 <span style="color:#95F204" id="roll_qm_rate_6"></span></div>
                <div style="width: 50%;float: left;">窗膜环比 <span style="color:#95F204" id="roll_win_rate_6"></span></div>
                </p>
            </div>
        </div>
        <div class="widget-container-box" style="width: 50%;float: left; padding: 10px;">
            <div class="widget-content-container widget-content-container-title" style="">
                <h6 class="card-title">今年|最佳省代漆膜/窗膜销售分数</h6>
                <h6 class="card-subtitle mb-2 text-muted">{{ date('Y') . '/1/1'  }}~{{ date('Y/m/d') }}</h6>
                <p>
                    <a href="/admin/stat_compare/dist_scores?type=1" style="cursor: pointer"><span style="font-size: 2rem;" id="roll_qm_4"></span>&nbsp;&nbsp;分</a>
                    /
                    <a href="/admin/stat_compare/dist_scores?type=2" style="cursor: pointer"><span style="font-size: 2rem;" id="roll_win_4"></span> 分</a>
                </p>
                <p class="show-percent">
                <div style="width: 50%;float: left;">漆膜同比 <span style="color:#95F204" id="roll_qm_rate_7"></span></div>
                <div style="width: 50%;float: left;">窗膜同比 <span style="color:#95F204" id="roll_win_rate_7"></span></div>
                </p>
                <p class="show-percent">
                <div style="width: 50%;float: left;">漆膜环比 <span style="color:#95F204" id="roll_qm_rate_8"></span></div>
                <div style="width: 50%;float: left;">窗膜环比 <span style="color:#95F204" id="roll_win_rate_8"></span></div>
                </p>
            </div>
        </div>
        <div class="widget-container-box" style="width: 100%; padding: 10px;">经销商</div>
        <div class="widget-container-box" style="width: 50%;float: left; padding: 10px;">
            <div class="widget-content-container widget-content-container-title" style="">
                <h6 class="card-title">今年|最佳经销商漆膜/窗膜销售卷数</h6>
                <h6 class="card-subtitle mb-2 text-muted">{{ date('Y') . '/1/1'  }}~{{ date('Y/m/d') }}</h6>
                <p>
                    <a href="/admin/stat_compare/dealer_sales?type=1" style="cursor: pointer"><span style="font-size: 2rem;" id="roll_qm_5"></span>&nbsp;&nbsp;卷</a>
                    /
                    <a href="/admin/stat_compare/dealer_sales?type=2" style="cursor: pointer"><span style="font-size: 2rem;" id="roll_win_5"></span> 卷</a>
                </p>
                <p class="show-percent">
                <div style="width: 50%;float: left;">漆膜同比 <span style="color:#95F204" id="roll_qm_rate_9"></span></div>
                <div style="width: 50%;float: left;">窗膜同比 <span style="color:#95F204" id="roll_win_rate_9"></span></div>
                </p>
                <p class="show-percent">
                <div style="width: 50%;float: left;">漆膜环比 <span style="color:#95F204" id="roll_qm_rate_10"></span></div>
                <div style="width: 50%;float: left;">窗膜环比 <span style="color:#95F204" id="roll_win_rate_10"></span></div>
                </p>
            </div>
        </div>
        <div class="widget-container-box" style="width: 50%;float: left; padding: 10px;">
            <div class="widget-content-container widget-content-container-title" style="">
                <h6 class="card-title">今年|最佳经销商漆膜销售分数/窗膜销售分数</h6>
                <h6 class="card-subtitle mb-2 text-muted">{{ date('Y') . '/1/1'  }}~{{ date('Y/m/d') }}</h6>
                <p>
                    <a href="/admin/stat_compare/dealer_scores?type=1" style="cursor: pointer"><span style="font-size: 2rem;" id="roll_qm_6"></span>&nbsp;&nbsp;分</a>
                    /
                    <a href="/admin/stat_compare/dealer_scores?type=2" style="cursor: pointer"><span style="font-size: 2rem;" id="roll_win_6"></span> 分</a>
                </p>
                <p class="show-percent">
                <div style="width: 50%;float: left;">漆膜同比 <span style="color:#95F204" id="roll_qm_rate_11"></span></div>
                <div style="width: 50%;float: left;">窗膜同比 <span style="color:#95F204" id="roll_win_rate_11"></span></div>
                </p>
                <p class="show-percent">
                <div style="width: 50%;float: left;">漆膜环比 <span style="color:#95F204" id="roll_qm_rate_12"></span></div>
                <div style="width: 50%;float: left;">窗膜环比 <span style="color:#95F204" id="roll_win_rate_12"></span></div>
                </p>
            </div>
        </div>
        <div style="width: 50%;float: left; padding: 5px 10px;">
            <div style="float: left; width: 20%;">
                <button type="button" class="btn btn-secondary" id="all_country">全国</button>
            </div>
            <div style="float: left; width: 40%;">
                <div class="input-group mb-3 custom-control-inline">
                    <div class="input-group-prepend">
                        <span class="input-group-text">省代</span>
                    </div>
                    <select class="form-control" style="width: 60%" id="distributions">
                        <option selected disabled value="">选择省代</option>
                        @if (!empty($distributions))
                            @foreach($distributions as $distribution)
                                <option value="{{ $distribution->id }}">{{ $distribution->abbr }}</option>
                            @endforeach
                        @endif
                    </select>
                </div>
            </div>
            <div style="float: left; width: 40%;">
                <div class="input-group mb-3 custom-control-inline">
                    <div class="input-group-prepend" style="width: 30%;">
                        <span class="input-group-text">经销商</span>
                    </div>
                    <select class="form-control" style="width: 70%" id="dealers">
                        <option selected disabled value="">选择经销商</option>
                    </select>
                </div>
            </div>
        </div>
        <div style="width: 50%;float: left; padding: 5px 10px;">
            <div class="input-group mb-3 custom-control-inline" style="float: left; width: 40%;">
                <div class="input-group-prepend">
                    <span class="input-group-text">年份</span>
                </div>
                <select class="form-control" style="width: 50%;" id="year">
                    @for ($i = date('Y'); $i >= 2016; $i--)
                        <option value="{{ $i }}">{{ $i }}</option>
                    @endfor
                </select>
            </div>
            <div class="input-group mb-3 custom-control-inline" style="float: left; width: 40%;">

            </div>
        </div>
        <div class="widget-container widget-container-show">
            <div class="widget-content-container">
                <div class="row show-title">
                    <div style="float: left; width: 40%;padding-left: 10px;">省代完成漆膜任务排名</div>
                    <div style="float: left; width: 30%;">
                        <select class="form-control" style="width: 80%;" id="month_3">
                            <option value="">月份总计</option>
                            <option value="01">1</option>
                            <option value="02">2</option>
                            <option value="03">3</option>
                            <option value="04">4</option>
                            <option value="05">5</option>
                            <option value="06">6</option>
                            <option value="07">7</option>
                            <option value="08">8</option>
                            <option value="09">9</option>
                            <option value="10">10</option>
                            <option value="11">11</option>
                            <option value="12">12</option>
                        </select>
                    </div>
                    <div style="padding-left: 14%;">
                        <span style="cursor: pointer;display: none;" id="return_roll_3">返回</span>
                        <span style="cursor: pointer;" id="look_roll_3">查看更多</span>
                    </div>
                </div>
                <div class="show_line_area" id="roll_3" ></div>
            </div>
        </div>
        <div class="widget-container widget-container-show">
            <div class="widget-content-container">
                <div class="row show-title">
                    <div style="float: left; width: 40%;padding-left: 10px;">省代完成窗膜任务排名</div>
                    <div style="float: left; width: 30%;">
                        <select class="form-control" style="width: 80%;" id="month_4">
                            <option value="">月份总计</option>
                            <option value="01">1</option>
                            <option value="02">2</option>
                            <option value="03">3</option>
                            <option value="04">4</option>
                            <option value="05">5</option>
                            <option value="06">6</option>
                            <option value="07">7</option>
                            <option value="08">8</option>
                            <option value="09">9</option>
                            <option value="10">10</option>
                            <option value="11">11</option>
                            <option value="12">12</option>
                        </select>
                    </div>
                    <div style="padding-left: 14%;">
                        <span style="cursor: pointer;display: none;" id="return_roll_4">返回</span>
                        <span style="cursor: pointer;" id="look_roll_4">查看更多</span>
                    </div>
                </div>
                <div class="show_line_area" id="roll_4" ></div>
            </div>
        </div>
        <div class="widget-container widget-container-show">
            <div class="widget-content-container">
                <div class="row show-title">
                    <div style="float: left; width: 40%;padding-left: 10px;">经销商完成漆膜任务排名</div>
                    <div style="float: left; width: 30%;">
                        <select class="form-control" style="width: 80%;" id="month_1">
                            <option value="">月份总计</option>
                            <option value="01">1</option>
                            <option value="02">2</option>
                            <option value="03">3</option>
                            <option value="04">4</option>
                            <option value="05">5</option>
                            <option value="06">6</option>
                            <option value="07">7</option>
                            <option value="08">8</option>
                            <option value="09">9</option>
                            <option value="10">10</option>
                            <option value="11">11</option>
                            <option value="12">12</option>
                        </select>
                    </div>
                    <div style="padding-left: 14%;">
                        <span style="cursor: pointer;display: none;" id="return_roll_1">返回</span>
                        <span style="cursor: pointer;" id="look_roll_1">查看更多</span>
                    </div>
                </div>
                <div class="show_line_area" id="roll_1"></div>
            </div>
        </div>
        <div class="widget-container widget-container-show">
            <div class="widget-content-container">
                <div class="row show-title">
                    <div style="float: left; width: 40%;padding-left: 10px;">经销商完成窗膜任务排名</div>
                    <div style="float: left; width: 30%;">
                        <select class="form-control" style="width: 80%;" id="month_2">
                            <option value="">月份总计</option>
                            <option value="01">1</option>
                            <option value="02">2</option>
                            <option value="03">3</option>
                            <option value="04">4</option>
                            <option value="05">5</option>
                            <option value="06">6</option>
                            <option value="07">7</option>
                            <option value="08">8</option>
                            <option value="09">9</option>
                            <option value="10">10</option>
                            <option value="11">11</option>
                            <option value="12">12</option>
                        </select>
                    </div>
                    <div style="padding-left: 14%;">
                        <span style="cursor: pointer;display: none;" id="return_roll_2">返回</span>
                        <span style="cursor: pointer;float: right;" id="look_roll_2">查看更多</span>
                    </div>
                </div>
                <div class="show_line_area" id="roll_2"></div>
            </div>
        </div>
        <div class="widget-container widget-container-show">
            <div class="widget-content-container">
                <div class="row show-title">
                    <div class="col" style="float: left;padding-left: 10px;">销售情况</div>
                    <div class="col" style="text-align: right;">
                        <span style="cursor: pointer;display: none;" id="return_all_sale">返回</span>
                    </div>
                </div>
                <div class="show_line_area" id="roll_sale"></div>
            </div>
        </div>
        <div class="widget-container widget-container-show">
            <div class="widget-content-container">
                <div class="row show-title">
                    <div class="col" style="float: left;padding-left: 10px;">全国任务值</div>
                    <div class="col" style="text-align: right;">
                        <span style="cursor: pointer;display: none;" id="return_country_task">返回</span>
                    </div>
                </div>
                <div class="show_line_area" id="country_task"></div>
            </div>
        </div>
        <br clear="all" />
    </div>
    </div>
@endsection
@section('script')
    <script src="https://code.highcharts.com/highcharts.src.js"></script>
    <script src="/dist/admin/stat.js"></script>
    <script type="text/javascript">
        $(function () {
            showSales();
            showWindow(1);
            showWindow(2);
            showQm(1);
            showQm(2);
            showCountryTask();
            allSales();
            allScores();
            dealerScores();
            dealerSales();
            distSales();
            distScores();
            $("#year").on('change', function () {
                showSales();
                showWindow(1);
                showWindow(2);
                showQm(1);
                showQm(2);
                showCountryTask();
            });
            $("#look_roll_1").on("click", function() {
                showMoreQm(1);
                $(this).hide();
            });
            $("#look_roll_2").on("click", function() {
                showMoreQm(2);
                $(this).hide();
            });
            $("#look_roll_3").on("click", function() {
                showMoreWin(1);
                $(this).hide();
            });
            $("#look_roll_4").on("click", function() {
                showMoreWin(2);
                $(this).hide();
            });
            $("#export_all_sale").on("click", function() {
                exportData('all_sale');
            });
            $("#return_all_sale").on("click", function () {
                $(this).hide();
                showSales();
            });
            $("#return_roll_1").on("click", function () {
                $(this).hide();
                showQm(1);
                $("#look_roll_1").show();
            });
            $("#return_roll_2").on("click", function () {
                $(this).hide();
                showQm(2);
                $("#look_roll_2").show();
            });
            $("#return_roll_3").on("click", function () {
                $(this).hide();
                showWindow(1);
                $("#look_roll_3").show();
            });
            $("#return_roll_4").on("click", function () {
                $(this).hide();
                showWindow(2);
                $("#look_roll_4").show();
            });
            $("#month_3").on("change", function () {
                if ($("#look_roll_3").is(":visible")) {
                    showWindow(1);
                } else {
                    showMoreWin(1);
                }
            })
            $("#month_2").on("change", function () {
                if ($("#look_roll_2").is(":visible")) {
                    showQm(2);
                } else {
                    showMoreQm(2);
                }
            })
            $("#month_4").on("change", function () {
                if ($("#look_roll_4").is(":visible")) {
                    showWindow(2);
                } else {
                    showMoreWin(2);
                }
            })
            $("#month_1").on("change", function () {
                if ($("#look_roll_1").is(":visible")) {
                    showQm(1);
                } else {
                    showMoreQm(1);
                }
            })
            $("#return_country_task").on("click", function () {
                $(this).hide();
                showCountryTask();
            });
            $("#distributions").select2();
            $("#dealers").select2();

            $("#distributions").on("change", function () {
                showWindow(1);
                showWindow(2);
                showQm(1);
                showQm(2);
                $("#all_country").removeClass('btn-secondary').addClass('btn-primary');
                if ($("#distributions").val() == '' || typeof $("#distributions").val() == 'undefined' || $("#distributions").val() == null) {
                    return;
                }
                request.post('/admin/ajax/getDealers', {
                    creator_id: $("#distributions").val(),
                    t: 1,
                }).then(function (d) {
                    console.log(d);
                    let data = d.data;
                    $("#dealers").empty().append('<option selected disabled value="">选择经销商</option>');
                    if (data != '' && data.length > 0) {
                        for (let i in data) {
                            $("#dealers").append('<option value="' + data[i]['value'] + '">'+ data[i]['label'] +'</option>');
                        }
                    }
                });
            });

            $("#dealers").on('change', function () {
                $("#all_country").removeClass('btn-secondary').addClass('btn-primary');
                showWindow(1);
                showWindow(2);
                showQm(1);
                showQm(2);
            });

            $("#all_country").on('click', function () {
                $("#distributions").val('').trigger('change');
                $("#dealers").val('').empty().append('<option selected disabled value="">选择经销商</option>');
                $(this).removeClass('btn-primary').addClass('btn-secondary');
            });
        });

        function showCountryTaskDetail(index) {
            $.ajax({
                url: '/admin/stat/showCountryTaskDetail',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: parseInt(index) + 1,
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    if (data.list == '' || typeof data.list == 'undefined') {
                        return;
                    }
                    let table = '<table class="table">';
                    table += '<thead><tr style="background-color: rgb(248, 248, 248);"><th>膜卷号</th><th>任务值</th></tr></thead>';

                    for (let i in data.list) {
                        table += '<tr><td>' + data.list[i]['abbr_name'] + '</td>';
                        table += '<td>' + data.list[i]['total_score'] + '</td></tr>';
                    }
                    table += '</table>';
                    $("#return_country_task").show();
                    $("#country_task").empty().addClass('show-over').append(table);
                }
            });
        }

        function showCountryTask() {
            $.ajax({
                url: '/admin/stat/countryTask',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: $("#month").val(),
                    dist_id: $("#distributions").val(),
                    dealer_id: $("#dealers").val(),
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data.list);
                    if (typeof data.list == 'undefined' || data.list.length <= 0) {
                        data.list = [];
                    }
                    Highcharts.chart('country_task', {
                        title: {
                            text: ''
                        },
                        credits: {
                            enabled: false
                        },
                        xAxis: {
                            categories: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月']
                        },
                        yAxis: {
                            title: '',
                        },
                        legend: {
                            align: 'center',
                            verticalAlign: 'bottom'
                        },
                        tooltip: {
                            pointFormat: '<b>{point.y}</b>'
                        },
                        plotOptions: {
                            series: {
                                cursor: 'pointer',
                                events: {
                                    click: function(event) {
                                        showCountryTaskDetail(event.point.index);
                                    }
                                }
                            }
                        },
                        series: data.list,
                        responsive: {
                            rules: [{
                                condition: {
                                    maxWidth: 500
                                },
                                chartOptions: {
                                    legend: {
                                        layout: 'horizontal',
                                        align: 'center',
                                        verticalAlign: 'bottom'
                                    }
                                }
                            }]
                        }
                    });
                }
            });
        }

        function allSales() {
            $.ajax({
                url: '/admin/stat/storeSales',
                type: 'get',
                data: {
                    'user_type' : 1,
                },
                dataType: 'json',
                success: function (data) {
                    $("#roll_qm_1").text(data.list.sale_qm_total);
                    $("#roll_win_1").text(data.list.sale_win_total);
                    $("#roll_qm_rate_1").text(data.list.sale_qm_rate + '%');
                    $("#roll_qm_rate_2").text(data.list.sale_hb_qm_rate + '%');
                    $("#roll_win_rate_1").text(data.list.sale_win_rate + '%');
                    $("#roll_win_rate_2").text(data.list.sale_hb_win_rate + '%');
                }
            });
        }

        function allScores() {
            $.ajax({
                url: '/admin/stat/storeScores',
                type: 'get',
                data: {
                    user_type: 1,
                },
                dataType: 'json',
                success: function (data) {
                    $("#roll_qm_2").text(data.list.sale_qm_total);
                    $("#roll_win_2").text(data.list.sale_win_total);
                    $("#roll_qm_rate_3").text(data.list.sale_qm_rate + '%');
                    $("#roll_qm_rate_4").text(data.list.sale_hb_qm_rate + '%');
                    $("#roll_win_rate_3").text(data.list.sale_win_rate + '%');
                    $("#roll_win_rate_4").text(data.list.sale_hb_win_rate + '%');
                }
            });
        }

        function distScores() {
            $.ajax({
                url: '/admin/stat/storeScores',
                type: 'get',
                data: {
                    user_type: 2,
                },
                dataType: 'json',
                success: function (data) {
                    $("#roll_qm_4").text(data.list.sale_qm_total);
                    $("#roll_win_4").text(data.list.sale_win_total);
                    $("#roll_qm_rate_7").text(data.list.sale_qm_rate + '%');
                    $("#roll_qm_rate_8").text(data.list.sale_hb_qm_rate + '%');
                    $("#roll_win_rate_7").text(data.list.sale_win_rate + '%');
                    $("#roll_win_rate_8").text(data.list.sale_hb_win_rate + '%');
                }
            });
        }

        function distSales() {
            $.ajax({
                url: '/admin/stat/storeSales',
                type: 'get',
                data: {
                    'user_type' : 2,
                },
                dataType: 'json',
                success: function (data) {
                    $("#roll_qm_3").text(data.list.sale_qm_total);
                    $("#roll_win_3").text(data.list.sale_win_total);
                    $("#roll_qm_rate_5").text(data.list.sale_qm_rate + '%');
                    $("#roll_qm_rate_6").text(data.list.sale_hb_qm_rate + '%');
                    $("#roll_win_rate_5").text(data.list.sale_win_rate + '%');
                    $("#roll_win_rate_6").text(data.list.sale_hb_win_rate + '%');
                }
            });
        }

        function dealerSales() {
            $.ajax({
                url: '/admin/stat/storeSales',
                type: 'get',
                data: {
                    'user_type' : 3,
                },
                dataType: 'json',
                success: function (data) {
                    $("#roll_qm_5").text(data.list.sale_qm_total);
                    $("#roll_win_5").text(data.list.sale_win_total);
                    $("#roll_qm_rate_9").text(data.list.sale_qm_rate + '%');
                    $("#roll_qm_rate_10").text(data.list.sale_hb_qm_rate + '%');
                    $("#roll_win_rate_9").text(data.list.sale_win_rate + '%');
                    $("#roll_win_rate_10").text(data.list.sale_hb_win_rate + '%');
                }
            });
        }

        function dealerScores() {
            $.ajax({
                url: '/admin/stat/storeScores',
                type: 'get',
                data: {
                    user_type: 3,
                },
                dataType: 'json',
                success: function (data) {
                    $("#roll_qm_6").text(data.list.sale_qm_total);
                    $("#roll_win_6").text(data.list.sale_win_total);
                    $("#roll_qm_rate_11").text(data.list.sale_qm_rate + '%');
                    $("#roll_qm_rate_12").text(data.list.sale_hb_qm_rate + '%');
                    $("#roll_win_rate_11").text(data.list.sale_win_rate + '%');
                    $("#roll_win_rate_12").text(data.list.sale_hb_win_rate + '%');
                }
            });
        }

        function exportData(type) {
            let url = '/admin/statExport/index?type=' + type;
            if ($("#year").val() != '' && typeof $("#year").val() != 'undefined') {
                url += '&year=' + $("#year").val();
            }
            if ($("#month").val() != '' && typeof $("#month").val() != 'undefined' && $("#month").val() != null) {
                url += '&month=' + $("#month").val();
            }
            if ($("#distributions").val() != '' && typeof $("#distributions").val() != 'undefined' && $("#distributions").val() != null) {
                url += '&dist_id=' + $("#distributions").val();
            }
            if ($("#dealers").val() != '' && typeof $("#dealers").val() != 'undefined' && $("#dealers").val() != null) {
                url += '&dealer_id=' + $("#dealers").val();
            }
            location.href = url;
        }

        function showSales() {
            $.ajax({
                url: '/admin/stat/store_all_sales',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: $("#month").val(),
                    dist_id: $("#distributions").val(),
                    dealer_id: $("#dealers").val(),
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data.list);
                    if (typeof data.list == 'undefined' || data.list.length <= 0) {
                        data.list = [];
                    }
                    Highcharts.chart('roll_sale', {
                        title: {
                            text: ''
                        },
                        credits: {
                            enabled: false
                        },
                        xAxis: {
                            categories: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月']
                        },
                        yAxis: {
                            title: '',
                        },
                        legend: {
                            align: 'center',
                            verticalAlign: 'bottom'
                        },
                        tooltip: {
                            pointFormat: '<b>{point.y}</b>'
                        },
                        plotOptions: {
                            series: {
                                cursor: 'pointer',
                                events: {
                                    click: function(event) {
                                        showAllSales(event.point.index);
                                    }
                                }
                            }
                        },
                        series: data.list,
                        responsive: {
                            rules: [{
                                condition: {
                                    maxWidth: 500
                                },
                                chartOptions: {
                                    legend: {
                                        layout: 'horizontal',
                                        align: 'center',
                                        verticalAlign: 'bottom'
                                    }
                                }
                            }]
                        }
                    });
                }
            });
        }

        function showAllSales(month) {
            $.ajax({
                url: '/admin/stat/showRollSales',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: month,
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    if (data.list == '' || typeof data.list == 'undefined') {
                        return;
                    }
                    let table = '<table class="table">';
                    table += '<thead><tr style="background-color: rgb(248, 248, 248);"><th>膜名称</th><th>卷数</th></tr></thead>';
                    for (let i in data.list) {
                        table += '<tr><td>' + data.list[i]['name'] + '</td><td>' + data.list[i]['total'] + '</td></tr>';
                    }
                    table += '</table>';
                    $("#return_all_sale").show();
                    $("#roll_sale").empty().addClass('show-over').append(table);
                }
            });
        }

        function showMoreQm(type) {
            $.ajax({
                url: '/admin/stat/store_dealer_sales',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: $("#month_1").val(),
                    dist_id: $("#distributions").val(),
                    dealer_id: $("#dealers").val(),
                    type: type,
                    page: 'all',
                },
                dataType: 'json',
                success: function (data) {
                    if (typeof data.list == 'undefined' || data.list.length <= 0) {
                        return;
                    }
                    let id = type == 1 ? '#roll_1' : '#roll_2';
                    let return_id = type == 1 ? '#return_roll_1' : '#return_roll_2';
                    let table = '<table class="table">';
                    table += '<thead><tr style="background-color: rgb(248, 248, 248);"><th>经销商</th><th>分</th></tr></thead>';
                    for (let i in data.list) {
                        table += '<tr><td>' + data.list[i]['name'] + '</td><td>' + data.list[i]['y'] + '</td></tr>';
                    }
                    table += '</table>';
                    $(return_id).show();
                    $(id).empty().addClass('show-over').append(table);
                }
            });
        }

        function showQm(type) {
            $.ajax({
                url: '/admin/stat/store_dealer_sales',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: type == 1 ? $("#month_1").val() : $("#month_2").val(),
                    dist_id: $("#distributions").val(),
                    dealer_id: $("#dealers").val(),
                    type: type,
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    let result = [];
                    if (typeof data.list == 'undefined' || data.list.length <= 0) {
                        data.list = [];
                    }

                    Highcharts.chart(type == 1 ? 'roll_1' : 'roll_2', {
                        chart: {
                            type: 'column'
                        },
                        title: {
                            text: ''
                        },
                        credits: {
                            enabled: false
                        },
                        xAxis: {
                            type: 'category',
                            labels: {
                                rotation: -45  // 设置轴标签旋转角度
                            }
                        },
                        yAxis: {
                            min: 0,
                            title: '',
                        },
                        legend: {
                            enabled: false
                        },
                        tooltip: {
                            pointFormat: '任务值: <b>{point.y} </b> 任务值完成比例: <b>{point.percent}%</b>'
                        },
                        plotOptions: {
                            series: {
                                cursor: 'pointer',
                                events: {
                                    click: function(event) {
                                        console.log(event);
                                        showDealerRolls(event.point.name, type);
                                    }
                                }
                            }
                        },
                        series: [{
                            name: '任务值',
                            data: data.list,
                            dataLabels: {
                                enabled: true,
                                rotation: -90,
                                color: '#FFFFFF',
                                align: 'right',
                                y: 10
                            }
                        }]
                    });
                }
            });
        }

        function showDealerRolls(name, type) {
            $.ajax({
                url: '/admin/stat/showDealerRolls',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: type == 1 ? $("#month_1").val() : $("#month_2").val(),
                    name: name,
                    type: type,
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    if (data.list == '' || typeof data.list == 'undefined') {
                        return;
                    }
                    let table = '<table class="table">';
                    table += '<thead><tr style="background-color: rgb(248, 248, 248);"><th>膜名称</th><th>卷数</th></tr></thead>';
                    for (let i in data.list) {
                        table += '<tr><td>' + data.list[i]['film_name'] + '</td><td>' + data.list[i]['num'] + '</td></tr>';
                    }
                    table += '</table>';
                    $(type == 1 ? "#return_roll_1" : "#return_roll_2").show();
                    $(type == 1 ? "#look_roll_1" : "#look_roll_2").hide();
                    $(type == 1 ? "#roll_1" : "#roll_2").empty().addClass('show-over').append(table);
                }
            });
        }

        function showMoreWin(type) {
            $.ajax({
                url: '/admin/stat/store_distribution_sales',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: type == 1 ? $("#month_3").val() : $("#month_4").val(),
                    dist_id: $("#distributions").val(),
                    type: type,
                    page: 'all',
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    let result = [];
                    if (typeof data.list == 'undefined' || data.list.length <= 0) {
                        return false;
                    }

                    let id = type == 1 ? '#roll_3' : '#roll_4';
                    let return_id = type == 1 ? '#return_roll_3' : '#return_roll_4';
                    let table = '<table class="table">';
                    table += '<thead><tr style="background-color: rgb(248, 248, 248);"><th>经销商</th><th>分</th></tr></thead>';
                    for (let i in data.list) {
                        table += '<tr><td>' + data.list[i]['name'] + '</td><td>' + data.list[i]['y'] + '</td></tr>';
                    }
                    table += '</table>';
                    $(return_id).show();
                    $(id).empty().addClass('show-over').append(table);
                }
            });
        }

        function showWindow(type) {
            $.ajax({
                url: '/admin/stat/store_distribution_sales',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: type == 1 ? $("#month_3").val() : $("#month_4").val(),
                    dist_id: $("#distributions").val(),
                    type: type,
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    let result = [];
                    if (typeof data.list == 'undefined' || data.list.length <= 0) {
                        data.list = [];
                    }

                    var chart = Highcharts.chart(type == 1 ? 'roll_3' : 'roll_4', {
                        chart: {
                            type: 'column'
                        },
                        title: {
                            text: '',
                        },
                        credits: {
                            enabled: false
                        },
                        xAxis: {
                            type: 'category',
                            labels: {
                                rotation: -45  // 设置轴标签旋转角度
                            },
                        },
                        yAxis: {
                            min: 0,
                            title: '',
                        },
                        legend: {
                            enabled: false
                        },
                        plotOptions: {
                            series: {
                                cursor: 'pointer',
                                events: {
                                    click: function(event) {
                                        console.log(event);
                                        showDistRolls(event.point.name, type);
                                    }
                                }
                            }
                        },
                        tooltip: {
                            pointFormat: '任务值: <b>{point.y} </b> 任务值完成比例: <b>{point.percent}%</b>'
                        },
                        series: [{
                            name: '任务值',
                            data: data.list,
                            dataLabels: {
                                enabled: true,
                                rotation: -90,
                                color: '#FFFFFF',
                                align: 'right',
                                y: 10
                            }
                        }]
                    });
                }
            });
        }

        function showDistRolls(name, type) {
            $.ajax({
                url: '/admin/stat/showDistRolls',
                type: 'get',
                data: {
                    year: $("#year").val(),
                    month: type == 1 ? $("#month_3").val() : $("#month_4").val(),
                    type: type,
                    name: name,
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    if (data.list == '' || typeof data.list == 'undefined') {
                        return;
                    }
                    let table = '<table class="table">';
                    table += '<thead><tr style="background-color: rgb(248, 248, 248);"><th>膜名称</th><th>卷数</th></tr></thead>';
                    for (let i in data.list) {
                        table += '<tr><td>' + data.list[i]['film_name'] + '</td><td>' + data.list[i]['num'] + '</td></tr>';
                    }
                    table += '</table>';
                    $(type == 1 ? "#return_roll_3" : "#return_roll_4").show();
                    $(type == 1 ? "#look_roll_3" : "#look_roll_4").hide();
                    $(type == 1 ? "#roll_3" : "#roll_4").empty().addClass('show-over').append(table);
                }
            });
        }


    </script>
@endsection
